{extend name="./tpl/default/mobile/public/layout.html" /}
{block name="header"}
<link rel="stylesheet" href="/public/home/mobile/css/member/youhuijuan.css">
{/block}
{block name="head"}
<div class="am-g" style="font-size:20px; height:34px;margin-top: 10px;">
    <div class="am-u-sm-6" style="font-size: 18px;padding-left: 0px;">
        <a href="{:url('/home/User/set')}" onclick="history.back(-1)"><span
                class="icon iconfont icon-xiangzuojiantou"></span></a>
    </div>
    <div class="am-u-sm-6" style="font-size: 18px;">
        优惠卷
    </div>

</div>
<hr style="border:1px solid #e0e0e0;margin: 0px;">
{/block}
{block name="body"}
<div id="youhui_list">
    {volist name="list" id="vo" mod='4'}

    {/volist}
</div>
{/block}
{block name="script"}
<script src="/public/plugins/dropload/dropload.js"></script>
<script src="/public/plugins/template/template.js"></script>
<script type="text/html" id="list-tpl">
    {{each data as value index}}
    <div class="stamp stamp0{{ index%4+1}}" style="margin-bottom:12px;width: 100%;"
         {{ if value.status}}
         onclick="showMsg(this)"
            {{ /if}}

         data-url="{:url('sendCard')}?card_id={{ value.card_id}}"
         data-msg="{{ value.direction}}"
         style="text-align: center; width: 100%;
    text-align: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;">
        <div class="par">
            <p>{{ value.title}}</p>
            <sub class="sign">￥</sub>
            <span>{$vo.card_money}</span>
            <sub>优惠券</sub>
            <p>订单满{$vo.card_order_money}元</p>
        </div>
        <div class="copy" style="padding: 10px 6px 10px 12px;
    font-size: 24px;">
            <p>
                {{ if value.send_type==2}}
            <div>￥<span class="price">{{ value.sale_money}}</span>元</div>
            {{ else}}
            <div><span class="price">免费</span></div>
            {{ /if}}
                <br>
            </p>
            {{ if value.status}}
            <a >查看详情</a>
            {{ else}}
            <a >已领取</a>
            {{ /if}}
        <!--<i></i>-->
    </div>
    <div style="clear: both;"></div>
    <div class="prolist-box" >
        <div style="clear: both;"></div>
        <div class="pma" >
            <div class="pinga">SALL</div>
            <div class="pxaf">
                <span>{{ value.title}}</span>
            </div>
            <div style="clear: both;"></div>
            <div style="line-height: 37px; color:#B5B5B5;">2017-12-1</div>
            <div style="clear: both;"></div>
        </div>
        <div class="fasa">
            <h2 class="title">{{ value.title}}</h2>
            {{ if value.send_type==2}}
            <div>￥<span class="price">{{ value.sale_money}}</span>元</div>
            {{ else}}
            <div><span class="price">免费</span></div>
            {{ /if}}

        </div>
    </div>
    <div class="direction"  style=" background: #fff;height: 100px;">

        <divstyle="float:right;">
        {{ if value.status}}
        <a class="weui-btn weui-btn_mini weui-btn_primary" data-href="{:url('sendCard')}?card_id={{ value.card_id}}" style="width: 68px;margin-top: 0px;margin-left: 270px;font-size: 10px;display: block;top: 27px;">领取</a>
        {{ else}}
        <a class="weui-btn weui-btn_mini weui-btn_primary weui-btn_disabled" style="width: 68px;margin-top: 0px;margin-left: 270px;font-size: 10px;display: block;top: 27px;">已领取</a>
        {{ /if}}
    </div>
    </div>
    </div>


    {{/each}}
</script>
<script>
    function showMsg(obj){
        var msg=$(obj).data('msg');
        var url=$(obj).data('url');
        layer.open({
            content:msg
            ,btn:['立即领取']
            ,yes:function () {
                location.href=url
            }
        })
    }
    var data = {
        page: 0,
        type: 'unused'//unused未使用且可用 expire未使用已过期 used已使用
    };

    var drop = $('#page').dropload({  //定义检测的容器
        scrollArea: window,
        loadDownFn: function (me) {     //loadDownFn是检测是否加载下方，其余方向请到文档中查看
            data.page++;            //每次都需要将页码加1
            // 拼接HTML
            $.ajax({
                type: 'POST',
                url: '{:url("index")}', data: data, success: function (datas) {
                    if (datas.code == 0) {
                        layer.open({
                            content: datas.msg
                            , skin: 'msg'
                            , time: 2 //2秒后自动关闭
                        });
                        // 锁定
                        me.lock();
                        // 无数据
                        me.noData();
                    }
                    var html = template('list-tpl', datas);     //此处使用的是上章节介绍的模板引擎
                    $('#youhui_list').append(html);        //将生成好的html插入放置列表的容器内
                    if (data.page >= datas.last_page) {     //检测是否加载到最后一页
                        // 锁定
                        me.lock();
                        // 无数据
                        me.noData();
                    }
                    me.resetload();         //这句必须写
                }
            });

        }
    });
</script>
{/block}
